<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>作物管理 - 智慧农业信息管理系统</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <style>
        body { font-family: 'Microsoft YaHei', sans-serif; background-color: #f8f9fa; }
        .navbar { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
        .navbar-brand, .navbar-nav .nav-link { color: white !important; }
        .sidebar { position: fixed; top: 56px; bottom: 0; left: 0; z-index: 100; padding: 20px 0; background: white; box-shadow: 2px 0 10px rgba(0,0,0,0.1); overflow-y: auto; }
        .sidebar .nav-link { color: #333; padding: 12px 20px; border-left: 3px solid transparent; transition: all 0.3s; }
        .sidebar .nav-link:hover, .sidebar .nav-link.active { color: #667eea; background-color: #f8f9fa; border-left-color: #667eea; }
        .sidebar .nav-link i { width: 20px; margin-right: 10px; }
        main { margin-top: 56px; padding-top: 20px; }
        .btn-primary { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border: none; }
        .modal-header { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; }
        .table-wrapper { background: white; border-radius: 10px; padding: 25px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
    </style>
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark fixed-top">
        <div class="container-fluid">
            <a class="navbar-brand" href="/index"><i class="fas fa-leaf"></i> 智慧农业信息管理系统</a>
            <div class="navbar-nav ms-auto">
                <span class="navbar-text text-white me-3"><i class="fas fa-user-circle"></i> 欢迎，<span th:text="${session.currentUser.realName}">用户</span></span>
                <a class="nav-link text-white" href="/logout"><i class="fas fa-sign-out-alt"></i> 退出</a>
            </div>
        </div>
    </nav>

    <div class="container-fluid">
        <div class="row">
            <nav class="col-md-2 d-md-block sidebar">
                <div class="position-sticky">
                    <ul class="nav flex-column">
                        <li class="nav-item"><a class="nav-link" href="/index"><i class="fas fa-home"></i> 首页</a></li>
                        <div th:if="${session.currentUser.role == 'admin'}">
                            <li class="nav-item"><a class="nav-link" href="/user/list"><i class="fas fa-users"></i> 用户管理</a></li>
                        </div>
                        <div th:if="${session.currentUser.role == 'admin' || session.currentUser.role == 'manager'}">
                            <li class="nav-item"><a class="nav-link" href="/field/list"><i class="fas fa-map"></i> 地块管理</a></li>
                            <li class="nav-item"><a class="nav-link active" href="/crop/list"><i class="fas fa-seedling"></i> 作物管理</a></li>
                            <li class="nav-item"><a class="nav-link" href="/material/list"><i class="fas fa-boxes"></i> 农资管理</a></li>
                            <li class="nav-item"><a class="nav-link" href="/plan/list"><i class="fas fa-calendar-alt"></i> 种植计划</a></li>
                            <li class="nav-item"><a class="nav-link" href="/farming/list"><i class="fas fa-tractor"></i> 农事记录</a></li>
                            <li class="nav-item"><a class="nav-link" href="/monitor/list"><i class="fas fa-chart-line"></i> 生长监测</a></li>
                            <li class="nav-item"><a class="nav-link" href="/product/list"><i class="fas fa-box"></i> 产品管理</a></li>
                            <li class="nav-item"><a class="nav-link" href="/sales/list"><i class="fas fa-shopping-cart"></i> 销售记录</a></li>
                            <li class="nav-item"><a class="nav-link" href="/statistics/dashboard"><i class="fas fa-chart-bar"></i> 数据统计</a></li>
                            <li class="nav-item"><a class="nav-link" href="/news/list"><i class="fas fa-bullhorn"></i> 新闻公告</a></li>
                        </div>
                        <li class="nav-item"><a class="nav-link" href="/farm/display"><i class="fas fa-store"></i> 农场展示</a></li>
                    </ul>
                </div>
            </nav>

            <main class="col-md-10 ms-sm-auto px-md-4">
                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3">
                    <h1 class="h2"><i class="fas fa-seedling"></i> 作物管理</h1>
                    <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#cropModal" onclick="resetForm()">
                        <i class="fas fa-plus"></i> 新增作物
                    </button>
                </div>

                <div class="table-wrapper">
                    <div th:if="${crops != null and !crops.isEmpty()}">
                        <table class="table table-hover">
                            <thead>
                                <tr><th>作物名称</th><th>品种</th><th>生长周期</th><th>播种季节</th><th>收获季节</th><th>适宜温度</th><th>操作</th></tr>
                            </thead>
                            <tbody>
                                <tr th:each="c : ${crops}">
                                    <td th:text="${c.cropName}">作物</td>
                                    <td th:text="${c.variety}">品种</td>
                                    <td><span th:text="${c.growthCycle}">0</span> 天</td>
                                    <td th:text="${c.sowingSeason}">季节</td>
                                    <td th:text="${c.harvestSeason}">季节</td>
                                    <td th:text="${c.suitableTemperature}">温度</td>
                                    <td>
                                        <button class="btn btn-sm btn-outline-primary me-1" th:onclick="'editCrop(' + ${c.id} + ')'"><i class="fas fa-edit"></i></button>
                                        <button class="btn btn-sm btn-outline-danger" th:onclick="'deleteCrop(' + ${c.id} + ')'"><i class="fas fa-trash"></i></button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div th:if="${crops == null or crops.isEmpty()}" class="alert alert-info text-center">
                        <i class="fas fa-info-circle fa-2x mb-2"></i>
                        <p>暂无作物信息，请点击"新增作物"按钮添加</p>
                    </div>
                </div>
            </main>
        </div>
    </div>

    <div class="modal fade" id="cropModal" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title"><i class="fas fa-seedling"></i> 作物信息</h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="cropForm">
                        <input type="hidden" id="cropId" name="id">
                        <div class="row">
                            <div class="col-md-6 mb-3">
                                <label class="form-label">作物名称 <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="cropName" name="cropName" required>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">品种 <span class="text-danger">*</span></label>
                                <input type="text" class="form-control" id="variety" name="variety" required>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">生长周期（天） <span class="text-danger">*</span></label>
                                <input type="number" class="form-control" id="growthCycle" name="growthCycle" required>
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">适宜温度</label>
                                <input type="text" class="form-control" id="suitableTemperature" name="suitableTemperature" placeholder="如: 20-30℃">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">播种季节</label>
                                <input type="text" class="form-control" id="sowingSeason" name="sowingSeason" placeholder="如: 春季">
                            </div>
                            <div class="col-md-6 mb-3">
                                <label class="form-label">收获季节</label>
                                <input type="text" class="form-control" id="harvestSeason" name="harvestSeason" placeholder="如: 夏季">
                            </div>
                            <div class="col-12 mb-3">
                                <label class="form-label">适宜土壤</label>
                                <input type="text" class="form-control" id="suitableSoil" name="suitableSoil" placeholder="如: 壤土、砂壤土">
                            </div>
                            <div class="col-12 mb-3">
                                <label class="form-label">作物描述</label>
                                <textarea class="form-control" id="description" name="description" rows="3"></textarea>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="saveCrop()"><i class="fas fa-save"></i> 保存</button>
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
    <script>
        function resetForm() {
            $('#cropForm')[0].reset();
            $('#cropId').val('');
        }

        function saveCrop() {
            const formData = {
                id: $('#cropId').val() || null,
                cropName: $('#cropName').val(),
                variety: $('#variety').val(),
                growthCycle: parseInt($('#growthCycle').val()),
                suitableTemperature: $('#suitableTemperature').val(),
                sowingSeason: $('#sowingSeason').val(),
                harvestSeason: $('#harvestSeason').val(),
                suitableSoil: $('#suitableSoil').val(),
                description: $('#description').val()
            };

            $.ajax({
                url: '/crop/save',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify(formData),
                success: function(res) {
                    if (res.code === 200) {
                        alert('保存成功！');
                        location.reload();
                    } else {
                        alert('保存失败: ' + res.message);
                    }
                },
                error: function() { alert('保存失败，请重试'); }
            });
        }

        function editCrop(id) {
            $.get('/crop/detail/' + id, function(res) {
                if (res.code === 200) {
                    const c = res.data;
                    $('#cropId').val(c.id);
                    $('#cropName').val(c.cropName);
                    $('#variety').val(c.variety);
                    $('#growthCycle').val(c.growthCycle);
                    $('#suitableTemperature').val(c.suitableTemperature);
                    $('#sowingSeason').val(c.sowingSeason);
                    $('#harvestSeason').val(c.harvestSeason);
                    $('#suitableSoil').val(c.suitableSoil);
                    $('#description').val(c.description);
                    $('#cropModal').modal('show');
                } else { alert('获取作物信息失败'); }
            });
        }

        function deleteCrop(id) {
            if (confirm('确定要删除这个作物吗？')) {
                $.post('/crop/delete/' + id, function(res) {
                    if (res.code === 200) {
                        alert('删除成功！');
                        location.reload();
                    } else { alert('删除失败: ' + res.message); }
                });
            }
        }
    </script>
</body>
</html>
